import Popup from './Popup'
import mapboxgl from 'mapbox-gl';
class Marker {
    marker
    map
    constructor(options, map) {
        let opt = {
            anchor: 'center',
            clickTolerance: 0,
            color: '#3FB1CE',
            draggable: false,
            scale: 1
        }
        Object.assign(opt, options)
        this.map = map
        this.marker = new mapboxgl.Marker(opt)
    }
    setMarker(center) {
        const mark = this.marker.setLngLat(center).addTo(this.map)
        return mark
    }
    setMarkerWithPopup(center, option) {
        let popup = new Popup(option, this.map)
        let opt = ['Text', 'Html', 'Dom']
        let key = opt.filter(item => {
            if(option.hasOwnProperty(item.toLowerCase())) {
                return item
            }
        })[0]
        popup[`set${key}`](option[key.toLowerCase()])

        let mark = this.marker.setLngLat(center).setPopup(popup.popup).addTo(this.map)
        return { mark, popup }
    }

    remove() {
        this.marker.remove()
    }
    // 获取marker dom节点
    getElement() {
        this.marker.getElement()
    }
    // 获取marker 经纬度
    getLngLat() {
        this.marker.getLngLat()
    }

}
export default Marker
